class Carousel {
    constructor() {
        this.index = 0;
    }
    init() {
        let _this = this;
        let timer = null;

        $('.right-arrow').on('click', () => {
            this.index++;
            if (this.index > $('.banner ul li').length - 1) {
                this.index = 0;
            }
            this.change();
        });
        $('.left-arrow').on('click', () => {
            this.index--;
            if (this.index < 0) {
                this.index = $('.banner ul li').length - 1;
            }
            this.change();
        });

        // 3.自动轮播
        timer = setInterval(() => {
            $('.right-arrow').click(); //自动触发点击事件，被动改成主动的。
        }, 3000);

        // 4.鼠标移入banner，停止图片轮播，移出banner，继续自动轮播。
        $('.banner').hover(
            function() { //鼠标移入
                clearInterval(timer);
            },
            function() { //鼠标移出
                timer = setInterval(() => {
                    $('.right-arrow').click(); //自动触发点击事件，被动改成主动的。
                }, 3000);
            }
        )
    }
    change() {
        // 切换的过程
        $('.banner ul li').eq(this.index).addClass('show').siblings().removeClass('show');
    }
}


export {
    Carousel
}